<section class="content-header">
    <ol class="breadcrumb">
        <li><a href="#"><i class="fa fa-dashboard"></i> 首页</a></li>
        <li><a href="#">权限管理</a></li>
        <li class="active">资源管理</li>
    </ol>
</section>
<!-- Main content -->
<section class="content">
    <div class="weiya-box weiya-box-table">
        <shiro:hasPermission name="permission:add">
            <div id="toolbar" class="btn-group grid-table-toolbar">
                <button id="addBtn" type="button" class="btn btn-primary" data-toggle="modal"
                        data-target="#permissionModal">
                    <span class="glyphicon glyphicon-plus" aria-hidden="true"></span>新增
                </button>
            </div>
        </shiro:hasPermission>
        <!--<table id="table"></table>-->
        <table id="menuTable" data-mobile-responsive="true" data-click-to-select="true">
            <thead>
            <tr>
                <th data-field="selectItem" data-checkbox="true"></th>
            </tr>
            </thead>
        </table>
    </div>
    <!-- 权限新增模态框 -->
    <div id="permissionModal" class="modal fade" tabindex="-1" role="dialog">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                            aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title">新增权限</h4>
                </div>
                <div class="modal-body">
                    <div>
                        <form class="form-horizontal" id="permissionForm">
                            <div class="box-body">
                                <div class="form-group">
                                    <label class="col-sm-3 control-label">类型 :</label>
                                    <div class="col-sm-8">
                                        <label class="radio-inline pr-5"><input type="radio" name="type" value="0">
                                            目录</label>
                                        <label class="radio-inline pr-5"><input type="radio" name="type" value="1"
                                                                                checked="checked" id="type-menu">
                                            菜单</label>
                                        <label class="radio-inline pr-5"><input type="radio" name="type" value="2">
                                            按钮</label>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-sm-3 control-label">资源名称 :</label>
                                    <div class="col-sm-8">
                                        <input type="text" class="form-control" name="name" id="name" require="必填项"
                                               placeholder="">
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-sm-3 control-label">上级资源 :</label>
                                    <div class="col-sm-8">
                                        <input type="text" class="form-control cursor-pointer" id="parentMenu"
                                               value="顶层菜单" onclick="showMenu(1)" readonly="readonly">
                                    </div>
                                </div>
                                <div class="form-group menuFlag">
                                    <label class="col-sm-3 control-label">资源url :</label>
                                    <div class="col-sm-8">
                                        <input type="text" class="form-control menuFlag" name="url" id="url"
                                               require="必填项" placeholder="">
                                    </div>
                                </div>
                                <div class="form-group menuFlag">
                                    <label class="col-sm-3 control-label">权限标识 :</label>
                                    <div class="col-sm-8">
                                        <input type="text" class="form-control menuFlag" name="perms" id="perms"
                                               require="必填项" placeholder="">
                                    </div>
                                </div>
                                <div class="form-group catalogFlag">
                                    <label class="col-sm-3 control-label">排序 :</label>
                                    <div class="col-sm-8">
                                        <input type="text" class="form-control catalogFlag" name="orderNum"
                                               id="orderNum" require="必填项" max="3" plusinteger="" placeholder="">
                                    </div>
                                </div>
                                <div class="form-group catalogFlag">
                                    <label class="col-sm-3 control-label">图标 :</label>
                                    <div class="col-sm-8">
                                        <input type="text" class="form-control catalogFlag" name="icon" id="icon"
                                               require="必填项" placeholder="">
                                        <a target="_blank" th:href="@{/index#icons}"><i class="fa fa-star"></i>查看系统图标<i
                                                class="fa fa-star"></i></a>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-sm-3 control-label">描述 :</label>
                                    <div class="col-sm-8">
                                        <input type="text" class="form-control" name="description" id="description"
                                               placeholder="">
                                    </div>
                                </div>
                                <input type="hidden" class="form-control" id="parentId" name="parentId" value="0">
                            </div>
                            <div class="box-footer">
                                <div class="pull-right">
                                    <button type="button" id="savePermission" class="btn btn-info">确定</button>
                                    <button type="button" data-dismiss="modal" class="btn btn-default">取消</button>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- 资源详情modal -->
    <div id="permissionDetailModal" class="modal fade" tabindex="-1" role="dialog">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                            aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title">资源信息</h4>
                </div>
                <div class="modal-body">
                    <div id="permissionOpenWindow">
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div id="menuLayer" style="display: none;padding-left: 20px;">
        <ul id="permissionTree" class="ztree"></ul>
    </div>
</section>
<script>
    var editFlag = "[[${@perms.hasPerm('permission:edit')}]]";
    var deleteFlag = "[[${@perms.hasPerm('permission:delete')}]]";
    // 默认选中菜单类型
    var menuType = "1";
    // 选中的上级的菜单类型
    var menuCheckedType = 0;
    // 详情中选中的上级的菜单类型
    var detailMenuCheckedType;

    var Menu = {
        id: "menuTable",
        table: null,
        layerIndex: -1
    };
</script>
<script th:src="@{/_resources/yiper/js/permission.js}"></script>